import 'package:syria_sports/core/app_export.dart';
import '../../../../widgets/app_bar/appbar_subtitle.dart';
import '../../../../widgets/app_bar/custom_app_bar.dart';
import '../../../../widgets/app_bar/outline_icon_button.dart';
import '../../../../widgets/refresh_win.dart';
import '../../../../widgets/screen_state_widget.dart';
import '../../add_tool/bloc/add_tool_page_screen.dart';
import '../widgets/tool_item_view.dart';
import 'tools_cubit.dart';
import 'package:flutter/material.dart';

class ToolsScreen extends StatelessWidget {
  const ToolsScreen({Key? key}) : super(key: key);

  static Widget builder({required BuildContext context}) {
    return BlocProvider<ToolsCubit>(
        create: (context) => ToolsCubit(
              ToolsInitial(),
            )..add(ToolsInitialEvent()),
        child: const ToolsScreen());
  }

  @override
  Widget build(BuildContext context) {
    double height = MediaQuery.of(context).size.height;
    double width = MediaQuery.of(context).size.width;
    return Container(
      decoration: BoxDecoration(
        image: DecorationImage(
          image: AssetImage(ImageConstant.imgBackground),
          fit: BoxFit.cover,
        ),
      ),
      child: Scaffold(
        appBar: _buildAppBar(context: context),
        body: BlocConsumer<ToolsCubit, ToolsState>(
          listener: (context, state) {
            // TODO: implement listener
          },
          buildWhen: (previous, state) {
            return state is ToolsDone ||
                state is ToolsDone ||
                state is ToolsLoading;
          },
          builder: (context, state) {
            var cubit = ToolsCubit.get(context);

            return RefreshWin(
              onRefresh:cubit.onRefresh,
              child: Container(
                height: height,
                width: width,
                decoration: BoxDecoration(
                  image: DecorationImage(
                    image: AssetImage(ImageConstant.imgBackground),
                    fit: BoxFit.cover,
                  ),
                ),
                child: ScreenStateWidget(
                  isDone: state is ToolsDone,
                  isError: state is ToolsError,
                  isLoading: state is ToolsLoading,
                  onRefresh: cubit.onRefresh,
                  onDone: BlocBuilder<ToolsCubit, ToolsState>(
                    buildWhen: (p, c) {
                      return c is SelectModeUpdate;
                    },
                    builder: (context, gridState) {
                      return GridView.builder(
                        gridDelegate: const SliverGridDelegateWithMaxCrossAxisExtent(
                          maxCrossAxisExtent: 100,
                        ),
                        itemCount: cubit.tools.length,
                        itemBuilder: (BuildContext ctx, index) {
                          return BlocBuilder<ToolsCubit, ToolsState>(
                            buildWhen: (pState,cState){
                              return cState is SelectTool &&
                                  cState.tool.toolId ==
                                      cubit.tools[index].toolId;
                            },
                             builder: (context, stateItem) {
                            return ToolItemView(
                              tool: cubit.tools[index],
                              isSelected:cubit.selectedTools.contains(cubit.tools[index]),
                            );
                          });
                        },
                      );
                    },
                  ),
                ),
              ),
            );
          },
        ),
      ),
    );
  }

  /// Section Widget
  PreferredSizeWidget _buildAppBar({required BuildContext context}) {
    return CustomAppBar(
      actions: [
        if (PrefUtils.isAdmin())
          BlocBuilder<ToolsCubit, ToolsState>(buildWhen: (p, c) {
            return c is SelectModeUpdate;
          }, builder: (context, state) {
            if (state is SelectModeUpdate && state.mode) {
              return OutlineIconButton(
                icon: Icons.close,
                margin: const EdgeInsets.all(8),
                padding: const EdgeInsets.all(2),
                onTapped: () {
                  ToolsCubit.get(context).add(SelectModeEvent(mode: false));
                },
              );
            }

            return OutlineIconButton(
              icon: Icons.add,
              margin: const EdgeInsets.all(8),
              padding: const EdgeInsets.all(2),
              onTapped: () async {
                await Navigator.push(
                    context,
                    MaterialPageRoute(
                        builder: (context) => const AddToolPageScreen()));
              },
            );
          }),
      ],
      leading: OutlineIconButton(
        imagePath: ImageConstant.imgRightIcon,
        onTapped: () {
          Navigator.pop(context);
        },
      ),
      title: AppbarSubtitle(
        text: "الادوات",
        margin: EdgeInsets.only(left: 12.h),
      ),
    );
  }
}
